<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Exam</title>
    <link rel="stylesheet" href="../css/exam.css" type="text/css" />
    <link rel="stylesheet" href="../css/common.css" type="text/css" />
    <link rel="stylesheet" href="../css/left_course.css" type="text/css" />
    <script type="text/javascript" src="../scripts/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="../scripts/jquery.animate-colors-min.js"></script>
    <script type="text/javascript" src="../scripts/navi_common.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#choose_logo").hover(function () {
                $(this).animate({ backgroundColor: '#30A8F4' }, { speed: 1000, queue: false });
            }, function () {
                $(this).animate({ backgroundColor: '#C35A33' }, { speed: 1000, queue: false });
            });

            $("#btn_begin").hover(function () {
                    $(this).animate({ backgroundColor: '#30A8F4' }, { speed: 1000, queue: false });
                }, function () {
                    $(this).animate({ backgroundColor: '#C35A33' }, { speed: 1000, queue: false });
            });
            $("#btn_begin").click(function(){
            	window.location.href = "paper.htm";
            });
        });
    </script>
</head>
<body>
	<%
		HttpSession s = request.getSession();
		String course = (String)s.getAttribute("select_course");
		String testType = (String)s.getAttribute("test_type");
		String whichTerm = (String)s.getAttribute("which_term");
	%>
<div id="bigContent">
<div id="head">
    <div id="title">
        <div class="title_left">
            <div class="titleText">Students Online Exam Platform</div>
        </div>
        <div class="title_right">
            <div class="avatar"><img src="../image/noavatar.jpg" alt="../image/noavatar.jpg"/></div>
            <div class="userState">
                <div class="userState_big"><a href="#">Tomato_team</a></div>
                <div class="userState_small"><a href="#">logout</a></div>
            </div>
        </div>
    </div>
    <form id="navi_form" action="/Exam1/servlet/NaviSelectServlet">
	    <div id="navi">
	        <div class="navi_top">
	            <ul class="all_navi">
	            	<li id="navi1" class="each_navi navi1">Examination</li>
	                <li id="navi2" class="each_navi navi2">Practice Test </li>
	                <li id="navi3" class="each_navi navi3">Free Q&A</li>
	            </ul>
	        </div>
	        <div class="navi_bottom">
	            <ul class="all_terms">
	            	<li class="each_term term1">freshman 1</li>
	                <li class="each_term term2">freshman 2</li>
	                <li class="each_term term3">sophomore 1</li>
	                <li class="each_term term4">sophomore 2</li>
	                <li class="each_term term5">junior 1</li>
	                <li class="each_term term6">junior 2</li>
	            </ul>
	        </div>
	    </div>
       	<input type="hidden" value="" name="test_type" id="test_type"/>
        <input type="hidden" value="" name="term" id="which_term"/>
    </form>
</div>
<div id="content_exam"  class="boxShadow">
    <div id="choose_logo">
        <div class="choose_logo_text">Choose Your Subject And Begin Exam</div>
        <div class="choose_logo_img"></div>
    </div>
    <div id="content_left">
        <div id="courses">
            <div id="courses_title">Courses</div>
            <form id="course_form" action="/Exam1/servlet/CourseSelectServlet" method="get">
	            <div id="courses_details">
	                <ul id="courses_list">
	                	<li class="li1"><div class="each_course_text">Principles of Database System</div></li>
	                    <li class="li2"><div class="each_course_text">Computer Network</div></li>
	                    <li class="li3"><div class="each_course_text">Principles of Computer Composition</div></li>
	                    <li class="li4"><div class="each_course_text">Software Engineering</div></li>
	                    <li class="li5"><div class="each_course_text">Artificial Intelligence</div></li>
	                    <li class="li6"><div class="each_course_text">Digital Image Processing</div></li>
	                    <li class="li7"><div class="each_course_text">Linux OS</div></li>
	                </ul>
	            </div>
	            <input type="hidden" value="" id="select_course" name="select_course"/>
	            <input type="hidden" value="exam" id="select_course" name="test_type"/>
            </form>
        </div>
    </div>
    <div id="content_right">
        <div id="subjects_name"><%=course %></div>
        <div id="exam_content">
            <div id="exam_details">
                <div id="exam_name" class="exam_name">2012-2013 Principles of Database System End of Term Exam</div>
                <div id="exam_notice" class="exam_notice"><p class="exam_notice_title">Notice:</p><div id="exam_notice_text" class="exam_notice_text">Yet my mind seemed to be in quest of something else -- 
                some way that I could personally apply to the close of Thanksgiving. 
                It must have taken me a half hour to sense that maybe some key to an answer could result 
                from reversing the word "Thanksgiving" -- at least that suggested a verbal direction, "Giving thanks."</div></div>
                <form>
	                <div id="begin_exam" class="begin_exam">
	                    <input type="button" id="btn_begin" value="Let's Begin"/>
	                    <input type="hidden" id="paper_id" value=""/>
	                </div>
                </form>
            </div>
        </div>
    </div>
    <div id="content_bottom"></div>   
</div>
</div>
</body>
</html>